<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>沈淑欣的个人主页</title>
<meta name="description" content="本人英文名沈淑欣，是一名前端工程师,对前端和编程技术非常热爱，做过很多技术方面的东西，对我有意向的公司和猎头可以QQ联系我或者给我发邮件，谢谢！">
<meta name="keywords" content="沈淑欣简历，前端工程师，求职前端，前端博客" />
<meta name="author" content="沈淑欣，个人博客:http://blog.youzewang.com">

<!-- Favicons
    ================================================== -->

<link rel="shortcut icon" href="img/favicon_jianli.ico" type="image/x-icon">


<!-- Bootstrap -->
<link rel="stylesheet" type="text/css"  href="css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="fonts/font-awesome/css/font-awesome.css">

<!-- Slider
    ================================================== -->
<link href="css/owl.carousel.css" rel="stylesheet" media="screen">
<link href="css/owl.theme.css" rel="stylesheet" media="screen">

<!-- Stylesheet
    ================================================== -->
<link rel="stylesheet" type="text/css"  href="css/style.css">
<link rel="stylesheet" type="text/css" href="css/prettyPhoto.css">

<link rel="stylesheet" type="text/css" href="fonts/sns_fonts/iconfont.css">


<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body id="page-top" data-spy="scroll" data-target=".navbar-fixed-top">
    <!-- Navigation -->
    <nav class="navbar navbar-custom navbar-fixed-top" role="navigation">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-main-collapse">
                    <i class="fa fa-bars"></i>
                </button>
                <a class="navbar-brand page-scroll" href="#page-top"><i class="fa fa-terminal"></i>沈淑欣个人主页</a>
            </div>

            <!-- Collect the nav links, forms, and other content for toggling -->
            <div class="collapse navbar-collapse navbar-right navbar-main-collapse">
                <ul class="nav navbar-nav">
                    <!-- Hidden li included to remove active class from about link when scrolled up past about section -->
                    <li class="hidden">
                        <a href="#page-top"></a>
                    </li>
                    <li>
                        <a class="page-scroll" href="#services">基本资料</a>
                    </li>
                    <li>
                        <a class="page-scroll" href="#works">项目经验</a>
                    </li>                    
                    <li>
                        <a class="page-scroll" href="#about">专业技能</a>
                    </li>                    
                    <li>
                        <a class="page-scroll" href="#team">工作经历</a>
                    </li>
                    <li>
                        <a class="page-scroll" href="#testimonials">自我评价</a>
                    </li>                    
                    <li>
                        <a class="page-scroll" href="#contact">联系方式</a>
                    </li>
                </ul>
            </div>
            <!-- /.navbar-collapse -->
        </div>
        <!-- /.container -->
    </nav>

<!-- Header -->
    <header class="intro">
        <div class="intro-body">
            <div class="container">
                <div class="row">
                    <div class="col-md-8 col-md-offset-2">
                        <h1>简历<span class="brand-heading">-前端工程师</span></h1>
                        <p class="intro-text">喜欢技术，热爱挑战</p>
                        <a href="#services" class="btn btn-circle page-scroll">
                            <i class="fa fa-angle-double-down animated"></i>
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </header>
<div class="copyrights">沈淑欣个人简历 <a href="http://blog.youzewang.com/jianli" >前端工程师</a></div>
<!-- Services Section -->
<div id="services" class="text-center">
  <div class="container">
    <div class="section-title center">
      <h2>基本 <strong>资料</strong></h2>
      <hr>
      </div>
    <div class="space"></div>
    <div class="row">
      <div class="col-md-3 col-sm-6 service"> <i class="fa fa-laptop"></i>
        <h4><strong>个人信息</strong></h4>
        <p>
		姓名: 沈淑欣 &nbsp;性别：女</br>
		年龄: 26岁 籍贯：漳州
		</p>
      </div>
      <div class="col-md-3 col-sm-6 service"> <i class="fa fa-code"></i>
        <h4><strong>专业学历</strong></h4>
        <p>
		专业：计算机科学与技术</br>
		学历：大学本科</br>
		
		</p>
      </div>
      <div class="col-md-3 col-sm-6 service"> <i class="fa fa-rocket"></i>
        <h4><strong>毕业学校</strong></h4>
        <p>
		  毕业学校：福州大学</br>
		  学习技能：计算机理论与编程
		</p>
      </div>
      <div class="col-md-3 col-sm-6 service"> <i class="fa fa-bullseye"></i>
        <h4><strong>联系方式</strong></h4>
        <p>QQ：1554816265</br>
		  邮箱：1554816265@qq.com</p>
      </div>
    </div>
  </div>
</div>
  <!-- Portfolio Section -->
  <div id="works">
    <div class="container"> <!-- Container -->
      <div class="section-title text-center center">
        <h2>项目 <strong>经验</strong></h2>
        <hr>
        <div class="clearfix"></div>
        <p>主要涉及电商，金融，教育，旅游，医学，后台管理系统等领域，包括PC端，手机端等等，主要技术是HTML+CSS+JS</p>
      </div>

      <div class="categories">
        <ul class="cat">
          <li>
            <ol class="type">
              <li><a href="#" data-filter="*" class="active">所有</a></li>
              <li><a href="#" data-filter=".web">PC端</a></li>
              <li><a href="#" data-filter=".app">移动端</a></li>
              <li><a href="#" data-filter=".branding">响应式</a></li>
            </ol>
          </li>
        </ul>
        <div class="clearfix"></div>
      </div>
      <!-- 项目列表 -->
      <div class="row">
          <!-- 旅行社pc -->
          <div class="col-sm-6 col-md-3 col-lg-3 web">
            <div class="portfolio-item">
              <div class="hover-bg">
                <div class="hover-text">
                  <h4>旅行社PC端</a></h4>
                  <small>技术：html5+css3</small>
                  <div class="clearfix"></div>
                  <p><a href="https://ssxdjq.github.io/travelAgencyPC-/index.html" target="_blank" class="btn btn-primary" role="button">查看效果</a> <a href="https://github.com/ssxdjq/travelAgencyPC-" target="_blank" class="btn btn-default" role="button">查看源码</a></p></div>
                <img src="img/portfolio_bg.jpg" class="img-responsive" alt="旅行社PC端"></div>
            </div>
          </div>
          <!-- 手机宣传单页pc -->
          <div class="col-sm-6 col-md-3 col-lg-3 web">
            <div class="portfolio-item">
              <div class="hover-bg">
                <div class="hover-text">
                  <h4>手机宣传单页pc端</a></h4>
                  <small>技术：html5+css3+js</small>
                  <div class="clearfix"></div>
                  <p><a href="https://ssxdjq.github.io/HTML5-CSS3MobileSale/" target="_blank" class="btn btn-primary" role="button">查看效果</a> <a href="https://github.com/ssxdjq/HTML5-CSS3MobileSale" target="_blank" class="btn btn-default" role="button">查看源码</a></p></div>
                <img src="img/portfolio_bg.jpg" class="img-responsive" alt="手机宣传单页"></div>
            </div>
          </div>
          <!-- 电商网站pc -->
          <div class="col-sm-6 col-md-3 col-lg-3 web">
            <div class="portfolio-item">
              <div class="hover-bg">
                <div class="hover-text">
                  <h4>电商网站</a></h4>
                  <small>技术：html5+css3+jquery</small>
                  <div class="clearfix"></div>
                  <p><a href="https://ssxdjq.github.io/jquery_demo/" class="btn btn-primary" target="_blank" role="button">查看效果</a> <a href="https://github.com/ssxdjq/jquery_demo" target="_blank" class="btn btn-default" role="button">查看源码</a></p></div>
                <img src="img/portfolio_bg.jpg" class="img-responsive" alt="电商网站"></div>
            </div>
          </div>
          <!-- 医药网站pc -->
          <div class="col-sm-6 col-md-3 col-lg-3 web">
            <div class="portfolio-item">
              <div class="hover-bg">
                <div class="hover-text">
                  <h4>医药网站</a></h4>
                  <small>技术：html5+css3+jquery</small>
                  <div class="clearfix"></div>
                  <p><a href="https://ssxdjq.github.io/Hospital-website/index.html" class="btn btn-primary" target="_blank" role="button">查看效果</a> <a href="https://github.com/ssxdjq/Hospital-website" target="_blank" class="btn btn-default" role="button">查看源码</a></p></div>
                <img src="img/portfolio_bg.jpg" class="img-responsive" alt="医药网站"></div>
            </div>
          </div>
          <!-- 响应式金融网站 -->
          <div class="col-sm-6 col-md-3 col-lg-3 web">
            <div class="portfolio-item">
              <div class="hover-bg">
                <div class="hover-text">
                  <h4>响应式金融网站</a></h4>
                  <small>技术：bootstrap+jquery</small>
                  <div class="clearfix"></div>
                  <p><a href="https://ssxdjq.github.io/Financial-website/index.html" class="btn btn-primary" target="_blank" role="button">查看效果</a> <a href="https://github.com/ssxdjq/Financial-website" target="_blank" class="btn btn-default" role="button">查看源码</a></p></div>
                <img src="img/portfolio_bg.jpg" class="img-responsive" alt="响应式金融网站"></div>
            </div>
          </div>
           <!-- 响应式后台管理系统 -->
          <div class="col-sm-6 col-md-3 col-lg-3 web">
            <div class="portfolio-item">
              <div class="hover-bg">
                <div class="hover-text">
                  <h4>响应式后台管理系统</a></h4>
                  <small>技术：bootstrap+jquery</small>
                  <div class="clearfix"></div>
                  <p><a href="https://ssxdjq.github.io/bootstrap-management/" class="btn btn-primary" target="_blank" role="button">查看效果</a> <a href="https://github.com/ssxdjq/bootstrap-management" target="_blank" class="btn btn-default" role="button">查看源码</a></p></div>
                <img src="img/portfolio_bg.jpg" class="img-responsive" alt="响应式后台管理系统"></div>
            </div>
          </div>
           <!-- vue-demo -->
          <div class="col-sm-6 col-md-3 col-lg-3 web">
            <div class="portfolio-item">
              <div class="hover-bg">
                <div class="hover-text">
                  <h4>vue-搭建售物平台</a></h4>
                  <small>技术：vue</small>
                  <div class="clearfix"></div>
                  <p><a href="https://github.com/ssxdjq/-vue-" target="_blank" class="btn btn-primary" role="button">查看源码</a></p></div>
                <img src="img/portfolio_bg.jpg" class="img-responsive" alt="vue-搭建售物平台"></div>
            </div>
          </div>
          <!-- react-demo -->
          <div class="col-sm-6 col-md-3 col-lg-3 web">
            <div class="portfolio-item">
              <div class="hover-bg">
                <div class="hover-text">
                  <h4>react-响应式新闻网站</a></h4>
                  <small>技术：react+ant design</small>
                  <div class="clearfix"></div>
                  <p><a href="https://github.com/ssxdjq/react-news" target="_blank" class="btn btn-primary" role="button">查看源码</a></p></div>
                <img src="img/portfolio_bg.jpg" class="img-responsive" alt="react-响应式新闻网站"></div>
            </div>
          </div>           
      </div>

    </div>
  </div>
</div>
<!-- About Section -->
<div id="about">
  <div class="container">
    <div class="section-title text-center center">
      <h2><strong>专业</strong> 技能</h2>
      <hr>
    </div>
    <div class="row">
      <div class="col-md-6"> <img src="img/about.png" class="img-responsive"> </div>
      <div class="col-md-6">
        <div class="about-text"> <i class="fa fa-users"></i>
          <div class="padding-left"><h4>Web前端</h4>
          <p>1.基础知识：html、css、html5、css3、javascript、jquery、ajax等，能进行网页兼容性测试，有手机端界面开发经验。2.前端框架：bootstrap,vue,react。 3.相关技术：webpack,svn,nodejs，git等。4.开发工具：sublime,hbuilder，eclipse等。</p></div>
          <i class="fa fa-magic"></i>
          <div class="padding-left"><h4>Web后端</h4>
          <p>了解jsp、java等后端开发语言，会搭建mysql/MongoDB数据库,并进行数据库的增删改查等基本操作。</p></div>
          <i class="fa fa-check-square-o"></i>
          <div class="padding-left"><h4>平面设计</h4>
          <p>photoshop熟练使用，会进行简单UI设计，实现切图与图片生成,了解网站性能优化和SEO优化。</p></div>
        </div>
      </div>
    </div>
  </div>
</div>
	<!-- <div id="achivements" class="section dark-bg">
			<div class="container">	
				<div class="row">
					<div class="col-md-3 col-sm-3">
						<div class="achivement-box">
							<i class="fa fa-smile-o"></i>
							<span class="count">25</span>
							<h4>Age Years</h4>                            
						</div>
					</div> 
					<div class="col-md-3 col-sm-3">
						<div class="achivement-box">
							<i class="fa fa-code"></i>
							<span class="count">100000</span>
							<h4>Code Amount</h4>                            
						</div>
					</div> 
					<div class="col-md-3 col-sm-3">
						<div class="achivement-box">
							<i class="fa fa-check-square-o"></i>
							<span class="count">4800</span>
                            <h4>Work Hour</h4>
						</div>
					</div> 
					<div class="col-md-3 col-sm-3">
						<div class="achivement-box">
							<i class="fa fa-trophy"></i>
							<span class="count">20</span>
							<h4>Projects Amount</h4>                            
						</div>
					</div> 
				</div>
			</div>
		</div> -->
<!-- Team Section -->
<div id="team" class="text-center">
  <div class="container">
    <div class="section-title center">
      <h2>人生 <strong>经历</strong></h2>
      <hr>
      <p>热爱互联网，热爱技术，专注于前端技术开发和用户体验</p>
    </div>
    <div id="row">
	
	<div class="col-md-3 col-sm-6">
        <div class="thumbnail"> <img src="img/team/02.jpg" alt="福州大学" class="img-circle team-img">
          <div class="caption">
            <h3>福州大学</h3>
            <p>计算机科学与技术</p>
            <p>主要学习c/java等编程语言，大学期间做过安卓项目/嵌入式项目，对编程有比较扎实的基础</p>
          </div>
        </div>
      </div>
	
      <div class="col-md-3 col-sm-6">
        <div class="thumbnail"> <img src="img/team/01.jpg" alt="杭州归谷培训中心" class="img-circle team-img">
          <div class="caption">
            <h3>福建东方睿智教育技术培训机构</h3>
            <p>软件开发培训</p>
            <p>在校期间参加过福建东方睿智嵌入式培训，2017年在东方睿智从事过兼职前端H5讲师</p>
          </div>
        </div>
      </div>
	  
      
	  
      <div class="col-md-3 col-sm-6">
        <div class="thumbnail"> <img src="img/team/03.jpg" alt="浙大网新" class="img-circle team-img">
          <div class="caption">
            <h3>福州驰骏网络科技有限公司</h3>
            <p>网页设计师</p>
            <p>工作时间：2014.1-2016.12，主要从事电商行业的网页开发，也包括其他行业网页开发以及图片设计制作等等</p>
          </div>
        </div>
      </div>
      <div class="col-md-3 col-sm-6">
        <div class="thumbnail"> <img src="img/team/04.jpg" alt="欧工国际" class="img-circle team-img">
          <div class="caption">
            <h3>福建富士通软件股份有限公司</h3>
            <p>前端工程师</p>
            <p>工作时间：2017.3-2017.9，主要从事软件系统PC端界面实现与兼容优化，前端界面框架设计</p>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
<!-- Testimonials Section -->
<div id="testimonials" class="text-center">
  <div class="container">
    <div class="section-title center">
      <h2>自我 <strong>评价</strong></h2>
      <hr>
    </div>
    <div class="row">
      <div class="col-md-8 col-md-offset-2">
        <div id="testimonial" class="owl-carousel owl-theme">
          <div class="item">       
            <p>
			热爱学习,良好的团队合作精神，能迅速融入新的团队。</br>易和人相处，拥有良好的亲和力。
			</p>
          </div>
          <div class="item">
            <p>
			有强烈的责任感，工作踏实，性格开朗乐观，积极上进，吃苦耐劳。</br>能在较大的压力下保持良好的工作状态，善于自我调节。
			</p>
          </div>
          <div class="item">
            <p>
			非常热爱编程，喜欢钻研新的技术，喜欢接受各种不同的挑战。</br>具有很强的自学能力和良好的学习方法。
			</p>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

<!-- Contact Section -->
<div id="contact" class="text-center">
  <div class="container">
    <div class="section-title center">
      <h2><strong>联系</strong> 方式</h2>
      <hr>
    </div>
    <div class="col-md-8 col-md-offset-2">
      <div class="col-md-4"> <i class="fa fa-map-marker fa-2x"></i>
        <p>福建省福州市</p>
      </div>
      <div class="col-md-4"> <i class="fa fa-envelope-o fa-2x"></i>
        <p>1554816265@qq.com</p>
      </div>
      <div class="col-md-4"> <i class="fa fa-phone fa-2x"></i>
        <p>QQ:1554816265</p>
      </div>
      <hr>
      <div class="clearfix"></div>
    </div>
    <div class="col-md-8 col-md-offset-2">
      <hr>
      <h3>给我发邮件</h3>
      <form name="sentMessage" id="contactForm" novalidate>
        <div class="row">
          <div class="col-md-6">
            <div class="form-group">
              <input type="text" id="name" class="form-control" placeholder="姓名" required="required">
              <p class="help-block text-danger"></p>
            </div>
          </div>
          <div class="col-md-6">
            <div class="form-group">
              <input type="email" id="email" class="form-control" placeholder="邮箱" required="required">
              <p class="help-block text-danger"></p>
            </div>
          </div>
        </div>
        <div class="form-group">
          <textarea name="message" id="message" class="form-control" rows="4" placeholder="内容" required></textarea>
          <p class="help-block text-danger"></p>
        </div>
        <div id="success"></div>
        <button type="submit" class="btn btn-default">确认发送</button>
      </form>
    </div>
  </div>
</div>
</div>
<nav id="footer">
  <div class="container">
    <div class="pull-left fnav">
      <p>Copyright &copy; 2017 作者：沈淑欣. 前端工程师
	   </p>
    </div>
    <div class="pull-right fnav">
      <ul class="footer-social">
	    <li><a href="http://v.t.sina.com.cn/share/share.php?url=http://blog.youzewang.com/jianli&title=沈淑欣简历"><i class="icon iconfont">&#xe66e;</i></a></li>
        <li><a href="http://connect.qq.com/widget/shareqq/index.html?url=https://ssxdjq.github.io/personal-pages/index.html"> <i class="icon iconfont">&#xe629;</i></a></li>
        <li><a href="http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=https://ssxdjq.github.io/personal-pages/index.html"> <i class="icon iconfont">&#xe616;</i></a></li>

        <li><a href="http://share.renren.com/share/buttonshare.do?link=https://ssxdjq.github.io/personal-pages/index.html"><i class="icon iconfont">&#xe66b;</i></a></li>
      </ul>
    </div>
  </div>
</nav>

<!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> 
<script type="text/javascript" src="js/jquery.1.11.1.js"></script> 
<!-- Include all compiled plugins (below), or include individual files as needed --> 
<script type="text/javascript" src="js/bootstrap.js"></script> 
<script type="text/javascript" src="js/SmoothScroll.js"></script> 
<script type="text/javascript" src="js/jquery.prettyPhoto.js"></script> 
<script type="text/javascript" src="js/jquery.isotope.js"></script> 
<script type="text/javascript" src="js/jquery.counterup.js"></script> 
<script type="text/javascript" src="js/waypoints.js"></script>
<script type="text/javascript" src="js/jqBootstrapValidation.js"></script> 
<script type="text/javascript" src="js/contact_me.js"></script>
<script src="js/owl.carousel.js"></script>

<!-- Javascripts
    ================================================== --> 
<script type="text/javascript" src="js/main.js"></script>

<script>
 $(function()
 {
 var u = navigator.userAgent;
if (u.indexOf('Android') > -1 || u.indexOf('Linux') > -1||u.indexOf('iPhone') > -1||u.indexOf('Windows Phone') > -1||navigator.userAgent.indexOf("iPad")>-1) {
   $(".hover-bg .hover-text").css({'opacity':'1'});
   
   $(".hover-bg .hover-text>h4").css({'opacity':'1','-webkit-transform':'translateY(0)','transform':'translateY(0)'});
   
   $(".hover-bg .hover-text>i").css({'opacity':'1'});
} 
    
 });
  
</script>
</body>
</html>
